import React, {useState, useEffect} from 'react'
import NavBar from '@components/NavBar'
import request from "@services/request";
import './index.less'

const Team = (props) => {
  useEffect(() => {
    // getData()
  }, [])


  const { address } = props.state
  const { recommends, myLevel, totalMyAmount, totalAmount, areaMin, areaMax } = props.recommends

  return (
    <>
      <div className="background"></div>
      <div className="team">
        <NavBar title="我的社区" />
        <div className="team-header">
          <div className="header-content">
            <div className="header-avatar"></div>
            {/* <div className="header-invite">
              <p>邀请码</p>
              <p>{props.formatAddress(address)}<span>复制</span></p>
            </div> */}
            <div className="header-statistics">
              <div className="statistics-item">
                <div className="statistics-item-title">我的等级</div>
                <div className="statistics-item-number">V{myLevel}</div>
              </div>
              <div className="statistics-item">
                <div className="statistics-item-title">个人业绩</div>
                <div className="statistics-item-number">{totalMyAmount}</div>
              </div>
              <div className="statistics-item">
                <div className="statistics-item-title">团队业绩</div>
                <div className="statistics-item-number">{totalAmount}</div>
              </div>
              <div className="statistics-item">
                <div className="statistics-item-title">大区业绩</div>
                <div className="statistics-item-number">{areaMax}</div>
              </div>
              <div className="statistics-item">
                <div className="statistics-item-title">小区业绩</div>
                <div className="statistics-item-number">{areaMin}</div>
              </div>
            </div>
          </div>
        </div>
        <div className="main">
          <div className="table-container">
            <div className="table-row">
                <div className="table-cell header-cell">地址</div>
                <div className="table-cell header-cell">团队业绩</div>
                <div className="table-cell header-cell">等级</div>
                <div className="table-cell header-cell">注册时间</div>
            </div>
            {
              recommends && recommends.map(item => (
                <div className="table-row">
                    <div className="table-cell">{props.formatAddress(item.address)}</div>
                    <div className="table-cell">{item.amount}</div>
                    <div className="table-cell">v{item.myLevel}</div>
                    <div className="table-cell">{item.created_at || item.createdAt}</div>
                </div>
              ))
            }
          </div>
        </div>
      </div>
    </>
  )
}

export default Team;